"use client"; import { useState } from "react"; import Link from "next/link"; import { Check, ChevronDown, SlidersHorizontal, X } from "../shared/icons"; import type { FilterGroup } from "../shared/types"; import { filterGroups, allFilterGroups } from "./data"; const categoryTabs = [ { label: "焊线式插座", href: "/" }, { label: "焊板式插座", href: "/products/m5-welding-socket" }, { label: "预铸式电缆", href: "/products/m5-cable" }, { label: "配件", href: "/products/m5-accessories" } ]; type Selection = Record<string, string[]>; function FilterRows({ groups, selected, editing, onToggle, onToggleEditing, }: { groups: FilterGroup[]; selected: Selection; editing: Record<string, boolean>; onToggle: (group: FilterGroup, option: string) => void; onToggleEditing: (label: string) => void; }) { return (

); } export function BreadcrumbFilter() { const [selected, setSelected] = useState({}); const [editing, setEditing] = useState<Record<string, boolean>>({}); const [mobileOpen, setMobileOpen] = useState(false); const [expanded, setExpanded] = useState(false); const toggleOption = (group: FilterGroup, option: string) => { setSelected((current) => { const values = current[group.label] ?? []; const contains = values.includes(option); const nextValues = contains ? values.filter((value) => value !== option) : group.multi ? [...values, option] : [option]; return { ...current, [group.label]: nextValues }; }); }; const toggleEditing = (label: string) => { setEditing((current) => ({ ...current, [label]: !current[label] })); }; return (

setExpanded((open) => !open)} > {expanded ? "收起" : "展开"}

setMobileOpen(true)} > 筛选

{mobileOpen && (

setMobileOpen(false)}>

)}

); } export default BreadcrumbFilter;